<template>
	<view>
		<view style="width: 750rpx;height: 20rpx;background-color: #F5F5F8;"></view>
		<view style="width: 750rpx;height: 132rpx;border-bottom: 1rpx dashed #DDDDDD;">
			<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 40rpx;padding-top: 20rpx;color: #666666;">巡查时间：{{createTime}}</view>
			<view style="margin-top: 20rpx;">
				<text style="font-size: 32rpx;line-height: 32rpx;margin-left: 40rpx;color: #666666;" space="emsp">巡查人：{{userName}}  共{{count}}处隐患</text>
				<text style="font-size: 32rpx;line-height: 32rpx;color: #666666;" space="emsp" v-if="yinhuan!==0">，已整改{{repair}}处</text>
			</view>
		</view>
		<view v-for="(item,index) in list" style="position: relative;" :key="index">
			<view class="headline">{{index+1}}.{{item.name}}</view>
			<view v-for="(i,index) in item.item" :key="i">	
				<view class="choose" v-if="index==item.index[0]">
					<image src="../../static/icon_can@3x.png" class="image"></image>
					<view class="chooses">{{i}}</view>
				</view>
				<view class="choose" v-else>
					<image src="../../static/btn_normal@3x.png" class="image"></image>
					<view class="chooses">{{i}}</view>
				</view>
			</view>
			<view v-if="item.status==3">
				<view class="u1">整改说明</view>
				<view class="u2">{{item.repairs[0].remark}}</view>
				<view style="display: flex;flex-wrap: wrap;margin-left: 100rpx;">
					<view v-for="(e,imageIndex) in item.repairs[0].images" :key="e" >
						<image :src="e" style="width: 150rpx;height: 150rpx;margin:12rpx" @click="openImg(item,imageIndex)"></image>
					</view>
				</view>
				<view class="u3" style="margin-top: 40rpx;">整改时间：{{item.repairs[0].createTime}}</view>
				<view class="u3" style="margin-top: 20rpx;">整改人：{{item.repairs[0].userName}}</view>
			</view>
			<button class="btn" v-else @click="gotoZG(item.id)" v-if="level!=3">立即整改</button>
			<view class="line" v-if="index!==list.length-1"></view>
			<view class="line1" v-else></view>
		</view>
		<image src="../../static/img_k@3x.png" style="width: 362rpx;height: 360rpx;margin-top: 190rpx;margin-left: 208rpx;" v-if="list.length == 0 && (isLoadMore=='noMore')"></image>
		<view v-else>
			<view v-show="isLoadMore" style="margin-bottom: 30rpx;">
				<uni-load-more :status="isLoadMore" :contentText="contentText" showText="false" @clickLoadMore="loadmore()"></uni-load-more>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				yinhuan:1,
				list:[],
				createTime:'',
				userName:'',
				count:'',
				anwserId:'',
				page:1,
				repair:'',
				isLoadMore:'more',
				contentText:{contentdown: "查看更多",contentrefresh: "正在加载...",contentnomore: "没有更多数据了"},
				level:''
			}
		},
		methods: {
			gotoZG(id){
				uni.navigateTo({
					url:`../yinhuan/ZGxiangQ?id=${id}&real=${1}&repair=${this.repair}&createTime=${this.createTime}&userName=${this.userName}&count=${this.count}&anwserId=${this.anwserId}`
				})
			},
			async getName(){
				this.$myRequest({
					url:'/project_flood/v1/check/risk/page',
					data:{"pageNum":this.page,"pageSize":100,"anwserId": this.anwserId}
				}).then((res)=>{
					console.log(res);
					this.list=res.data.data.list;
					if(this.list.length<res.data.data.total)
						{
							this.isLoadMore='more'
						}
					else
						{
							this.isLoadMore='noMore'
						}
					
				})
			},
			async getCount(){
				this.$myRequest({
					url:'/project_flood/v1/check/risk/page',
					data:{"anwserId":this.anwserId,"status":3,"pageNum":this.page,"pageSize":100},
				}).then((res)=>{
					console.log(res);
					this.repair=res.data.data.total
					
				})
			},
			loadmore(){
				if(this.isLoadMore !== 'more') return
				this.page=this.page+1
				this.$myRequest({
					url: '/project_flood/v1/check/risk/page',
					data: {"pageNum":this.page,"pageSize":10,"anwserId": this.anwserId},
				}).then((res)=>{
					console.log(res);
					this.list=this.list.concat(res.data.data.list)
					if(this.list.length<res.data.data.total)
						{
							this.isLoadMore='more'
						}
					else
						{
							this.isLoadMore='noMore'
						}
				})
			},
			openImg(item,index){
				const images = item.repairs[0].images
				// console.log(e);
				// let imgsArray = [];
				// imgsArray[0] = e
				console.log(images,index);
				uni.previewImage({
				current: index,
				urls: images
				});
			},
		},
		onLoad(options) {
			try {
			    
				const A = uni.getStorageSync('level');
				this.level=A;
			    if (A) {
			        // console.log(X);
			    }
				
			} catch (e) {
			    // error
			}
			console.log(options,'11111');
			this.createTime=options.createTime
			this.userName=options.userName
			this.count=options.count
			this.anwserId=options.anwserId
			this.repair=options.repair
			if(options.counts!=undefined){
				this.repair=options.counts
			}
		},
		onShow() {
			this.getName()
			this.getCount()
		}
	}
</script>

<style lang="scss">
.headline{
	font-size: 36rpx;
	line-height: 36rpx;
	margin-left: 40rpx;
	margin-top: 40rpx;
}
.choose{
	display: flex;
	.image{
		width: 48rpx;
		height: 48rpx;
		margin-top: 40rpx
		;margin-left: 40rpx;
	}
	.chooses{
		font-size: 36rpx;
		line-height: 36rpx;
		margin-left: 26rpx;
		margin-top: 46rpx;
		font-weight: 300;
	}
	
}
.btn{
	position: absolute;
	right: 40rpx;
	bottom: 78rpx;
	width: 192rpx;
	height: 64rpx;
	border-radius: 38rpx;
	background-color: #519AFF;
	color: #FFFFFF;
	font-size: 32rpx;
	line-height: 64rpx;
}
.line{
	width: 750rpx;
	height: 1rpx;
	margin-top: 78rpx;
	background-color: #E5E5E5;
}
.line1{
	width: 750rpx;
	height: 1rpx;
	margin-top: 78rpx;
	background-color: #FFFFFF;
}
.u1{
	font-size: 32rpx;
	line-height: 32rpx;
	margin-top: 40rpx;
	margin-left: 112rpx;
	font-weight: 500;
}
.u2{
	color: #666666;
	font-size: 32rpx;
	line-height: 32rpx;
	margin-top: 20rpx;
	margin-left: 112rpx;
}
.u3{
	font-size: 28rpx;
	line-height: 28rpx;
	color: #666666;
	margin-left: 112rpx;
}
.img{
	width: 120rpx;
	height: 120rpx;
	margin-top: 20rpx;
	margin-left: 112rpx;
}
</style>
